import type { IColumnsOption } from 'vc';
import { CellRenderMap, INDEX, COMPANY_NAME, BUSINESS_DATA, REGISTERED_CAPITAL, PROVINCE, CITY, COUNTRY, INDUSTRY_CATEGORY } from '@/utils/tableColumn';
import { setHrefUrlTool } from '@/utils';

export function useTable() {
  const columns = ref<IColumnsOption[]>([
    { ...INDEX },
    { ...COMPANY_NAME },
    {
      field: 'dischargePermitNumber',
      title: '许可证编号',
      width: 230,
      sortable: true,
      sortBy: 'dischargePermitNumber',
      showOverflow: 'ellipsis',
      cellRender: {
        name: CellRenderMap.HighLight
      }
    },
    {
      field: 'managementCategoryType',
      title: '许可证管理类别',
      width: 150,
      align: 'center',
      sortable: true,
      sortBy: 'managementCategoryCode',
      formatter({ row, cellValue }) {
        return row.managementCategoryType !== '未披露' ? cellValue : '-';
      }
    },
    {
      width: 160,
      field: 'attachments',
      title: '许可证书',
      slots: {
        default: ({ row }) => {
          if (row.attachments?.length === 0) {
            return '-';
          }
          return row?.attachments?.map((item) => {
            return (
              <div class="flex justify-center">
                <a onClick={() => setHrefUrlTool(item.fileType, item.fileUrl)}>{item.name}</a>
                <br />
              </div>
            );
          });
        }
      }
    },
    { field: 'productionSite', title: '生产经营场所', width: 270, showOverflow: 'title' },
    {
      field: 'periodOfValidityStartDate',
      title: '有效期限',
      width: 200,
      align: 'center',
      formatter: ({ cellValue, column, row }) => {
        return `${row?.periodOfValidityStartDate} 至 ${row?.periodOfValidityExpirationDate}`;
      }
    },
    {
      width: 160,
      field: 'permitChanges',
      title: '许可变更',
      align: 'center',
      slots: {
        default: ({ row }) => {
          if (row.permitChanges.length) {
            return <a onClick={() => permitChangesDetailFn(row.permitChanges)}>{row.permitChanges.length}次</a>;
          }
          return '-';
        }
      }
    },
    {
      field: 'issuingDate',
      title: '发证日期',
      align: 'center',
      // sort: 'desc',
      sortable: true,
      sortBy: 'issuingDate',
      width: 110
    },
    { field: 'issuingDepartment', title: '发证机关', width: 160 },
    {
      field: 'whetherWasteGasPollution',
      title: '主要污染物类型',
      width: 160,
      sortable: true,
      sortBy: 'whetherWasteGasPollution',
      slots: {
        // 使用 JSX 渲染
        default: ({ row }) => {
          let content1, content2;
          if (row.isWasteGasPollution) {
            content1 = <>{<span class="tags-gas">废气</span>}</>;
          }
          if (row.isWasteWaterPollution) {
            content2 = <>{<span class="tags-water">废水</span>}</>;
          }
          return !row.isWasteGasPollution && !row.isWasteWaterPollution ? (
            '-'
          ) : (
            <div class="tags">
              {content1} {content2}
            </div>
          );
        }
      }
    },
    { ...PROVINCE },
    { ...CITY },
    { ...COUNTRY },
    { ...INDUSTRY_CATEGORY },
    { ...BUSINESS_DATA },
    { ...REGISTERED_CAPITAL }
  ]);

  // 变更弹窗
  const showPermitChangesDetail = ref(false);
  const permitChangesDetails = ref([]);
  const detailColumns = ref([
    { field: 'dischargePermitNumber', align: 'center', title: '许可证编号', minWidth: 200 },
    { field: 'changeType', align: 'center', title: '业务类型' },
    { field: 'version', align: 'center', title: '版本', width: 100 },
    { field: 'completionDate', align: 'center', title: '办结日期', width: 100 },
    {
      align: 'center',
      title: '有效期限',
      width: 200,
      formatter: ({ row }) => {
        return `${row?.periodOfValidityStartDate ?? '-'} 至 ${row?.periodOfValidityExpirationDate ?? '-'}`;
      }
    }
  ]);

  const permitChangesDetailFn = (data) => {
    showPermitChangesDetail.value = true;
    permitChangesDetails.value = data;
  };

  return {
    columns,
    showPermitChangesDetail,
    permitChangesDetails,
    detailColumns
  };
}
